﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="ReceiveFromSupplier.aspx.cs" Inherits="MonkeyWarranty.Web.WarrantyTickets.ReceiveFromSupplier" %>

<%@ Import Namespace="Resources" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <title>
        <%= GlobalStrings.ReceivedFromSupplier %></title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div class="row">
        <div class="col-lg-12">
            <h3><%=GlobalStrings.ReceivedFromSupplier %></h3>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="alert alert-danger" runat="server" id="errorMessage" visible="False">
                <label class="control-label">
                    <asp:Literal ID="lblErrorMessage" runat="server"></asp:Literal></label>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <%=GlobalStrings.WarrantyProducts %>
                </div>
                <div class="panel-body">
                    <div class="col-lg-6">
                        <p>
                            <%=GlobalStrings.TicketCode %>: <span data-bind="text: Product().WarrantyTicketId"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Code %> SP: <span data-bind="text: Product().Code"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Name %>: <span data-bind="text: Product().Name"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Model %>: <span data-bind="text: Product().Model"></span>
                        </p>
                    </div>
                    <div class="col-lg-6">
                        <p>
                            <%=GlobalStrings.Manufacturers %>: <span data-bind="text: Product().ManufacturerName"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Serial %>: <span data-bind="text: Product().Serial"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Quantity %>: <span data-bind="text: Product().Quantity"></span>
                        </p>
                    </div>
                    <div class="col-lg-12">
                        <div class="form-group">
                            <label><%=GlobalStrings.Description %></label>
                            <textarea class="form-control" rows="3" disabled="" data-bind="text: Product().Description"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div class="row">
        <div class="col-lg-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <%=GlobalStrings.AtSupplier %>
                </div>
                <div class="panel-body">
                    <div class="col-lg-12">
                        <p>
                            <strong><%=GlobalStrings.Suppliers %></strong>: 
                            <button id="btnSearchSupplier" data-toggle="modal" data-target="#supplierModal"><i class="fa fa-search"></i></button>
                        </p>
                    </div>
                    <div class="col-lg-6">
                       <p>
                            <%=GlobalStrings.Code %>: <span data-bind="text: Supplier().Code"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Name %>: <span data-bind="text: Supplier().Name"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Address %>: <span data-bind="text: Supplier().Address"></span>
                        </p>
                        <div class="form-group">
                            <label><%=GlobalStrings.SentDate %></label><br />
                            <input type="text" id="txtSentDate" data-bind="value: Product().SentDateString" class="textEntry date" />
                        </div>
                        <div class="form-group">
                            <label><%=GlobalStrings.ReceivedDate %></label><br />
                            <input type="text" id="txtReceivedDate" data-bind="value: Product().ReceivedDateString" class="textEntry date" />
                        </div>
                    </div>
                    <div class="col-lg-6">
                       <p>
                            <%=GlobalStrings.Phone %>: <span data-bind="text: Supplier().Phone"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Fax %>: <span data-bind="text: Supplier().Fax"></span>
                        </p>
                        <p>
                            <%=GlobalStrings.Email %>: <span data-bind="text: Supplier().Email"></span>
                        </p>
                        <div class="form-group">
                            <label><%=GlobalStrings.WishDate %></label><br />
                            <input type="text" id="txtWishDate" data-bind="value: Product().WishDateString" class="textEntry date" />
                        </div>
                    </div>
                    <div class="col-lg-12">
                        <div class="form-group">
                            <label><%=GlobalStrings.Note %></label>
                            <textarea class="form-control" rows="3" data-bind="value: Product().Note"></textarea>
                        </div>
                    </div>
                    <div class="col-lg-12">
                        <a class="btn btn-default" href="ProductAtSupplier.aspx"><%=GlobalStrings.Cancel %></a>
                        <button class="btn btn-primary" id="btnSave"><%=GlobalStrings.Save %></button>
                        <button class="btn btn-success" id="btnReceivedCompleted"><%=GlobalStrings.ReceivedCompleted %></button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Product Modal -->
    <div class="modal fade" id="supplierModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width: 850px; height: 400px;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel"><%=GlobalStrings.SuppliersList %></h4>
                </div>
                <div class="modal-body">
                    <div class="form-inline">
                        <input class="form-control" type="text" id="name" placeholder="<%=GlobalStrings.Name %>" />
                        <%=GlobalStrings.SupplierGroups %>:
                        <asp:DropDownList ID="ddlSupplierGroups" runat="server" CssClass="form-control"></asp:DropDownList>
                        <button class="btn btn-default" type="button" id="LoadRecordsButton"><i class="fa fa-search"></i></button>
                        <button class="btn btn-default" type="button" id="ResetButton"><i class="fa fa-refresh"></i></button>
                    </div>
                    <p></p>
                    <div id="SuppliersTableContainer"></div>
                    <p></p>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <!-- /.modal -->

    <script type="text/javascript">
        $(function () {
            $("#menu-warranty").addClass("active");
            $("#menu1-warranty").addClass("collapse in");
            $("#menu1-atsupplier").addClass("active");

            $("#txtSentDate").calendar({ timeSeparators: null });
            $("#txtWishDate").calendar({ timeSeparators: null });
            $("#txtReceivedDate").calendar({ timeSeparators: null });

            LoadProduct();

            $('#SuppliersTableContainer').jtable({
                paging: true,
                pageSize: 10,
                sorting: true,
                defaultSorting: 'Name ASC',
                actions: {
                    listAction: 'ReceiveFromSupplier.aspx/SearchSuppliers'
                },
                fields: {
                    Id: {
                        key: true,
                        create: false,
                        edit: false,
                        list: false
                    },
                    Code: {
                        title: '<%=GlobalStrings.Code %>',
                        list: false
                    },
                    Name: {
                        title: '<%=GlobalStrings.Name %>',
                        width: '20%',
                        display: function (data) {
                            return '<a href="javascript:void(0);" data-dismiss="modal" onclick="javascript:SelectSupplier({Id:' + data.record.Id +
                            ',Code:\'' + data.record.Code + '\'' +
                                ',Name:\'' + escape(data.record.Name) + '\'' +
                                ',Address:\'' + escape(data.record.Address) + '\'' +
                                ',Phone:\'' + escape(data.record.Phone) + '\'' +
                                ',Fax:\'' + escape(data.record.Fax) + '\'' +
                                ',Email:\'' + escape(data.record.Email) + '\'' +
                                    '});">' + data.record.Name + '</a>';
                        }
                    }
                }
            });

            $('#btnSearchSupplier').click(function (e) {
                e.preventDefault();
                <%--$('#SuppliersTableContainer').jtable('load', {
                    name: $('#name').val(),
                    supplierGroupId: $('#<% = ddlSupplierGroups.ClientID %>').val()
                });--%>
                $('#LoadRecordsButton').click();
            });

            //Re-load records when user click 'load records' button.
            $('#LoadRecordsButton').click(function (e) {
                e.preventDefault();
                $('#SuppliersTableContainer').jtable('load', {
                    name: $('#name').val(),
                    supplierGroupId: $('#<% = ddlSupplierGroups.ClientID %>').val()
                });
            });

            // reset button
            $('#ResetButton').click(function (e) {
                e.preventDefault();
                $('#name').val('');
                $('#<% = ddlSupplierGroups.ClientID %>').val('0');
                $('#LoadRecordsButton').click();
            });

            // send button
            $('#btnSave').click(function (e) {
                e.preventDefault();
                if (productViewModel.Supplier().Id <= 0) {
                    return;
                }

                // ajax sendtosupplier
                $.blockUI();
                $.ajax({
                    type: "POST",
                    url: "ReceiveFromSupplier.aspx/SendProductToSupplier",
                    data: JSON.stringify({
                        id: productViewModel.Product().Id(),
                        supplierId: productViewModel.Supplier().Id,
                        note: productViewModel.Product().Note(),
                        sentDate: $('#txtSentDate').val(), // productViewModel.Product().SentDateString(),
                        wishDate: $('#txtWishDate').val() // productViewModel.Product().WishDateString()
                    }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        //$('#LoadRecordsButton').click();
                        alert('Cập nhật thành công!');
                        //window.location = 'ProductAtSupplier.aspx';
                    },
                    failure: function (errMsg) {
                        alert(errMsg);
                    }
                });
            });

            // btnReceivedCompleted
            $('#btnReceivedCompleted').click(function (e) {
                e.preventDefault();
                if (productViewModel.Supplier().Id <= 0) {
                    return;
                }

                // ajax ReceivedCompleted
                $.blockUI();
                $.ajax({
                    type: "POST",
                    url: "ReceiveFromSupplier.aspx/ReceivedCompleted",
                    data: JSON.stringify({
                        id: productViewModel.Product().Id(),
                        supplierId: productViewModel.Supplier().Id,
                        note: productViewModel.Product().Note(),
                        sentDate: $('#txtSentDate').val(), // productViewModel.Product().SentDateString(),
                        wishDate: $('#txtWishDate').val(), // productViewModel.Product().WishDateString()
                        receivedDate: $('#txtReceivedDate').val() // productViewModel.Product().ReceivedDateString()
                    }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        //$('#LoadRecordsButton').click();
                        alert('Cập nhật thành công!');
                        window.location = 'ProductAtSupplier.aspx';
                    },
                    failure: function (errMsg) {
                        alert(errMsg);
                    }
                });
            });
        });
        
        var productId = <%=Request.Params["id"] %>;
        var productViewModel;
        function ProductViewModel(product) {
            var self = this;
            // data
            self.Product = ko.observable(product);
            self.Supplier = ko.observable({ Id: 0, Code: '', Name: '', Address: '', Phone: '', Fax: '', Email: '' });
        }

        function LoadProduct() {
            $.blockUI();

            $.ajax({
                url: "ReceiveFromSupplier.aspx/GetWarrantyProduct",
                data: JSON.stringify({id: productId}),
                type: "post",
                contentType: "application/json",
                async: true,
                success: function (data) {
                    var product = ko.mapping.fromJS(data.d);
                    productViewModel = new ProductViewModel(product);
                    ko.applyBindings(productViewModel);
                    
                    // load supplier
                    LoadSupplier(data.d.WarrantySupplierId);
                }
            });
        }

        function LoadSupplier(supplierId) {
            $.ajax({
                url: "ReceiveFromSupplier.aspx/GetSupplier",
                data: JSON.stringify({id: supplierId}),
                type: "post",
                contentType: "application/json",
                async: true,
                success: function (data) {
                    productViewModel.Supplier(data.d);
                }
            });
        }

        function SelectSupplier(supplier) {
            supplier.Name = unescape(supplier.Name);
            supplier.Address = supplier.Address == 'null' ? '' : unescape(supplier.Address);
            supplier.Phone = supplier.Phone == 'null' ? '' : supplier.Phone;
            supplier.Fax = supplier.Fax == 'null' ? '' : supplier.Fax;
            supplier.Email = supplier.Email == 'null' ? '' : supplier.Email;
            productViewModel.Supplier(supplier);
        }
    </script>
</asp:Content>
